<template>
	<view class="login_main">
		<view class="login_dh" v-if="!showld"></view>
		<view class="login_main" v-if="showld">
			<view class="login_bg1"></view>
			<view class="login_bg2"></view>
			<view class="lolgin_top">
				<font class="t20">登录</font>
				<font class=" t11">欢迎回来</font>
			</view>
			<view class="login_main_main">
				<view class="login_main_li">
					<image src="../../static/img/user.png" class="login_main_li_img" mode="widthFix"></image>
					<input type="number" class="login_main_li_inp  t22" v-model="tel" placeholder-class="t8"
						placeholder="请输入手机号" /> 
				</view>
				<view class="login_main_li">
					<image src="../../static/img/pwd.png" class="login_main_li_img" mode="widthFix"></image>
					<input type="text" password="true" class="login_main_li_inp  t22" placeholder-class="t8"
						placeholder="请输入密码" v-model="pwd" />
				</view>
				<view class="login_main_zhu">
					<view class="login_main_zhuce t5" @click="zhuce()">立即注册</view>
					<view class="login_main_wangji t8" @click="mima()">忘记密码？</view>
				</view>
				<view class="login_main_but t9" @click="denglu()">登录</view>
				<!-- <view class="login_zd" @click="zidong()">
					<view :class="classs"></view>
					<text class="t8">自动登陆</text>
				</view> -->
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				tel: '',
				pwd: '',
				checks: true,
				zd: 0,
				classs: 'login_zd_t act',
				aliId: '',
				wechatId: '',
				plat: 1,
				butcheck: 0,
				showld: true,
			}
		},
		onLoad() {
			var _this = this;
			// _this.showld = true;
			switch (uni.getSystemInfoSync().platform) {
				case 'android':
					_this.plat = 1;
					// console.log('客户端是Android')
					break;
				case 'ios':
					_this.plat = 2;
					// console.log('客户端是iOS')
					break;
			}
			uni.setStorage({
				key: 'plat',
				data: {
					plat: this.plat
				}
			});
			console.log("配置地址",getApp().globalData);
			uni.getStorage({
				key: 'user',
				success: function(res) {

					_this.tel = res.data.mobile;
					// console.log(_this.tel);
				}
			});
			uni.getStorage({
				key: 'pass',
				success: function(res) {
					// uni.showToast({
					// 	title: res,
					// 	icon: 'none',
					// 	duration: 2000
					// });
					// uni.showToast({
					// 	title: res,
					// 	icon: 'none',
					// 	duration: 2000
					// });
					console.log(res);
					if (res.data.tel&&res.data.pass) {						
							_this.showld = false;
							_this.tel = res.data.tel;
							_this.pwd = res.data.pass;
							console.log(_this.tel,_this.pwd);
							// if (!res.data.zd) {
							// 	_this.zd = 0;
							// } else {
							// 	_this.zd = res.data.zd;
							// }
							// if (_this.zd == 0) {
								_this.denglu();
							// }
					} else {
						_this.showld = true;
						// console.log(res);
					}
				},
				fail: function(e) {
					_this.showld = true;
					uni.showToast({
						title: e,
						icon: 'none',
						duration: 2000
					});
				}
			});
		},
		onBackPress(e) {
			if (this.showMask) {
				this.showMask = false;
				return true;
			} else {
				console.log(e);
				if (this.butcheck < 1) {
					this.butcheck++;
					uni.showToast({
						title: '再按一次退出应用',
						icon: 'none',
						duration: 2000
					});
				} else {
					plus.runtime.quit();
				}
				return true
			}
		},
		methods: {
			zhuce() {
				uni.navigateTo({
					url: '/pages/zhuce/zhuce'
				});
			},
			mima() {
				uni.navigateTo({
					url: '/pages/mima_wangji/mima_wangji'
				});
			},
			zidong() {
				if (this.zd == 0) {
					this.zd = 1;
					this.classs = 'login_zd_t';
				} else {
					this.zd = 0;
					this.classs = 'login_zd_t act';
				}
			},
			denglu() {
				if (this.checks === false) {
					return false
				}
				var reg = /^[1]([3-9])[0-9]{9}$/
				if (!(reg.test(this.tel))) {

					uni.showToast({
						title: '请输入正确的手机号',
						icon: 'none',
						duration: 2000
					});
					return false
					this.showld = true;
				}
				if (!(this.pwd)) {

					uni.showToast({
						title: '请输入密码',
						icon: 'none',
						duration: 2000
					});
					return false
					this.showld = true;
				}

				this.checks = false
				
				if (this.showld == true) {
				uni.showLoading(); //关闭加载动画
				}
				uni.request({
					header: {
						// 'Content-Type': 'application/x-www-form-urlencoded', //自定义请求头信息
					},
					url: getApp().globalData.mallHost + '/p/user/login', //仅为示例，并非真实接口地址。
					method: 'POST',
					data: {
						aliId: this.aliId, //阿里ID		false							string
						password: this.pwd, //	密码		false							string
						phone: this.tel, //	手机号		false							string
						plat: this.plat, //	平台		true							integer 0 平台 1 安卓 2 苹果 3 微信 4 阿里
						wechatId: this.wechatId, //	微信ID		false							string
					},
					success: (res) => {
				if (this.showld == true) {
						uni.hideLoading(); //关闭加载动画
				}
						this.checks = true
						console.log('登录结果;',res);
						if (res.data.status == '200') {
							if (res.data.data) {
								uni.setStorage({
									key: 'user',
									data: {
										status: res.data.data.status,
										headUrl: res.data.data.headUrl,
										id: res.data.data.id,
										level: res.data.data.level,
										type: res.data.data.type,
										nickName: res.data.data.nickName,
									}
								})
								uni.setStorage({
									key: 'token',
									data: res.data.data.id
								})
								uni.setStorage({
									key: 'userid',
									data: res.data.data.id
								})
								uni.setStorage({
									key: 'userId',
									data: res.data.data.id
								})
								uni.setStorage({
									key: 'openid',
									data: res.data.data.id
								})
							}
							uni.setStorage({
								key: 'pass',
								data: {
									pass: this.pwd,
									tel: this.tel,
									zd: this.zd
								}
							})
							if (this.showld == true) {
								uni.showToast({
									title: '登录成功',
									icon: 'success',
									duration: 2000
								});
							}
							// uni.switchTab({
							// 	url: '/pages/index/index'
							// });
							
							uni.navigateTo({
								url: '/package-mall/pages/index/index'
							});

						} else {

							this.showld = true;
							uni.showToast({
								title: res.data.msg,
								icon: 'none',
								duration: 2000
							});
						}
					},
					fail: (error) => {
						this.showld = true;
						uni.hideLoading(); //关闭加载动画
						this.checks = true
						console.log(error)
						uni.showToast({
							title: '登录失败',
							icon: 'none',
							duration: 2000
						});
					}
				});
			},
		}
	}
</script>

<style>
	.login_dh {
		width: 100%;
		height: 100vh;
		position: fixed;
		background: #FFFFFF url(../../static/img/jinruye.png) no-repeat center top;
		background-size: 100% 100%;
	}

	.login_main {

		width: 100%;
		height: auto;
		min-height: 100vh;
		max-height: 220vw;
		display: block;
		float: left;
		/* 	background: url(../../static/img/login.png) no-repeat top center; */
		background: #e9e9e9;
		background: -webkit-linear-gradient(67deg, #999, #f2f2f2, #c5c4c5);
		background: -o-linear-gradient(67deg, #999, #f2f2f2, #c5c4c5);
		background: -moz-linear-gradient(67deg, #999, #f2f2f2, #c5c4c5);
		background: linear-gradient(67deg, #999, #f2f2f2, #c5c4c5);
		background-size: auto 100%;
	}

	.login_main_main {
		width: 80%;
		height: auto;
		display: block;
		float: left;
		margin: 0 10%;
		top: 60vw;
		background: #FFFFFF;
		border-radius: 7vw;
		position: fixed;
		z-index: 99;
		padding: 10vw 0;
	}

	.login_main_main_logo {
		width: 17vw;
		height: 17vw;
		display: block;
		float: left;
		border-radius: 4vw;
		overflow: hidden;
		margin: 15.2vw 31.5vw;
	}

	.login_main_main_logo image {
		width: 17vw;
		height: auto;
		display: block;
		float: left;
	}

	.login_main_li {
		width: 64.8vw;
		height: 13.6vw;
		display: block;
		float: left;
		margin: 2vw 7.6vw;
		border: 1px solid #CFCFCF;
		border-radius: 6.8vw;
	}

	.login_main_li_img {
		width: 4.8vw;
		height: 5.3vw;
		display: block;
		float: left;
		margin: 4vw 6.5vw;
	}

	.login_main_li_inp {
		width: 42.2vw;
		height: 8vw;
		line-height: 8vw;
		display: block;
		float: left;
		margin-top: 2.8vw;
	}

	.login_main_zhu {
		width: 54.5vw;
		height: 8vw;
		line-height: 8vw;
		display: block;
		float: left;
		margin: 1vw 12.8vw;
	}

	.login_main_zhuce {
		width: auto;
		height: 8vw;
		line-height: 8vw;
		display: block;
		float: left;
	}

	.login_main_wangji {
		width: auto;
		height: 8vw;
		line-height: 8vw;
		display: block;
		float: right;
	}

	.login_main_but {
		width: 64.8vw;
		height: 13vw;
		display: block;
		float: left;
		margin: 2vw 7.6vw;
		line-height: 13vw;
		text-align: center;
		background: #f1c75e;
		border-radius: 6.5vw;
		background-size: 100%;
	}

	.login_zd {
		width: 100%;
		height: auto;
		display: block;
		float: left;
	}

	.login_zd_t {
		width: 4vw;
		height: 4vw;
		border: 1px solid #f1c75e;
		margin-left: 8vw;
		margin-top: 4vw;
		display: block;
		float: left;
	}

	.login_zd text {
		width: auto;
		height: 8vw;
		line-height: 8vw;
		display: block;
		float: left;
		margin-top: 2vw;
		margin-left: 3vw;
	}

	.act {
		background: #f1c75e;
	}

	.login_bg1 {
		width: 50vw;
		height: 50vw;
		border-radius: 50%;
		position: fixed;
		background: #F1C75E;
		right: -10vw;
		top: -15vw;
		z-index: 1;
	}

	.login_bg2 {
		width: 120vw;
		height: 200vw;
		border-radius: 50%;
		position: fixed;
		background: #F1C75E;
		right: -50vw;
		top: -60vw;
		z-index: 1;
		opacity: 0.5;
	}

	.lolgin_top {
		width: auto;
		height: auto;
		position: fixed;
		top: 40vw;
		left: 10vw;
	}

	.lolgin_top font {
		width: 100%;
		height: auto;
		display: block;
		float: left;
	}
</style>
